<template>
  <div class="reItem">
    <div class="reRow1 vux-1px-b">
      <img :src="item.logo.replace(/^https/,'http')">
      <line1 len="0.4rem" style="margin:0 0.2667rem"></line1>
      {{this.item.name}}
      <span class="date">{{this.item.tzdata}}</span>
    </div>
    <div class="reRow2 vux-1px-b">
      <div class="itemBox">
        <span id="yearRateBox">
          <span id="yearRate">{{this.item.yearRate}}</span>%
        </span>
        <span>预期年化</span>
      </div>
      <div class="itemBox" style="margin-left:0.53rem">
        <span id="reBackBox">
          <!-- <span id="reBack">{{this.item.reBack}}</span> -->
          <div v-if="this.item.type == 1">
            <span class="reBack">{{this.item.reBack}}</span>元
          </div>
          <div v-else>
            <span class="reBack">{{this.item.reBack}}</span>%
          </div>
        </span>
        <span>最高返利</span>
      </div>
      <line1 style="margin:0 0.3rem 0 .5rem"></line1>
      <div>
        <div>
          期限<span class="txt" v-if="item.qixianlx == 'day'">{{this.item.time}}天</span><span class="txt" v-else>{{this.item.time}}个月</span>
        </div>
        <div>
          起投<span class="txt">{{parseInt(this.item.money)|addYuan}}</span>
        </div>
      </div>
    </div>
    <div class="row3" v-html="getMsg">
    </div>
  </div>
</template>
<script>
import Line1 from '../../../component/common/Line'

export default {
  components:{
    Line1,
  },
  props:['item','type'],
  computed:{
    getMsg(){
      let getMsg = ''
      let item = this.item;
      switch(this.type){
        case 1:
          getMsg='待确认';
        break;
        case 2://TODO:处理日期成返利日期
          getMsg=`返利${item.flmoney}元.<span style="color:#939393;">预计${item.fldata}返利</span>`;
        break;
        case 3:
          getMsg ='未投标';
        break;
      }
      return getMsg;
    },
    isYuan2(){
      this.isYuan = /[\u4e00-\u9fa5]{1}$/.test(this.item.reBack);
      return this.isYuan?this.item.reBack.substring(0,this.item.reBack.length-1):this.item.reBack;
    },
  },
  data(){
    return {
      cssOB:{
        margin:'0 0.4rem 0 1rem',
      },
      isYuan:true
    }
  },
}
</script>
<style lang="less" scoped>
  .reItem{
    box-sizing: border-box;
    width: 9.2rem;
    height: 4.1067rem;
    box-shadow:2px 2px 10px #aaa;
    padding: 0 .56rem;
    margin-bottom: .2rem;
    // background-color: burlywood;
    .reRow1{
      height: 1.0667rem;
      // background-color: chartreuse;
      display: flex;
      flex-direction: row;
      align-items: center;
      line-height: .986667rem;
      img:first-child{
        width: 1.1333rem;
        height: 0.4133rem;
      }
      img:last-child{
        width: 0.16rem;
        height: 0.32rem;
        position: absolute;
        right: 1rem;
      }
      .date{
        color:#939393;
        position: absolute;
        right: 0;
      }
    }
    .reRow2{
      height: 2.1333rem;
      // background-color: cornflowerblue;
      display: flex;
      flex-direction: row;
      align-items: center;
      font-size: 0.2933rem;
      color: #c6c6c6;
      .itemBox{
        display: flex;
        flex-direction: column;
      }
      #yearRateBox{
        color:#dd3930;
        #yearRate{
          font-size: 0.6rem;
          margin-right:.1rem;
          font-weight: bold
        }
      }
      #reBackBox{
        color:#000;
        .reBack{
          font-size: 0.58rem;
          font-weight: bold;
          margin-right: .1rem;
        }
      }
      .txt{
        margin-left: 0.2667rem;
        color:#000;
      }
    }
    .row3{
      height: 0.88rem;
      line-height: .88rem;
      text-align: end;
      color: #dd3930;
    }
  }
</style>
